<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" href="http://medit.ddmap.com/ddmap-mobile-medit/js/ext-3.3.0/resources/css/ext-all.css"/>
<link href="${ctx}/css/hiddenwin.css" media="screen" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="${ctx}/js/ext-3.3.0/ext-base.js"></script>
<script type="text/javascript" src="${ctx}/js/ext-3.3.0/ext-all.js"></script>
<script type="text/javascript" src="${ctx}/js/ext-3.3.0/ext-lang-zh_CN.js"></script>
<script type="text/javascript" src="${ctx}/js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="${ctx}/js/ajaxfileupload.js"></script>
<script type="text/javascript" src="${ctx}/js/common.js"></script>
<title>文件管理</title>
 <style>
	    	body {
	    		background-color:RGB(245,244,249);
	    	}
			.x-panel-header-new{
			height:60px;
			background:#CDDEF3;
			padding:7px 0 0 10px;
		}
		.new-search-wrap{
			width:170px;
			height:47px;
			border:2px solid #9EBFDB;
			border-radius:5px;
			box-shadow:1px 1px 0 #ffffff;
			float:left;
			padding:2px 0 2px 6px;
		}
		.x-panel-header-new label{
			font-size:12px;
			color:#14428B;
			font-weight:bold;
			margin:0;
			padding:0;
			
		}
		.new-select-city{
			padding:0;
			width:68px;
			height:44px;
			display:inline-block;
			border-right:1px dotted #99BBE8;
			box-shadow:1px 0 0 #ffffff;
		}
		.new-select-city select{
			width:60px;
			height:26px;
			border:1px solid #7F9DB9;
			margin-top:2px;
		}
		.new-select-name{
			width:92px;
			height:44px;
			display:inline-block;
			border-right:1px solid #99BBE8;
		}
		.new-select-name input{
			height:22px;
			width:76px;
			padding-left:6px;
			border:1px solid #7F9DB9;
			margin-top:2px;
		}
		.new-select-data{
			border-right:1px solid #99BBE8;
			box-shadow:none;
		}
		.new-search-button{
			display:inline-block;
			width:50px;
			height:44px;
			margin-top:-10px;
			text-align: center;
		}
		.new-search-button input{
			background:url(../images/search.png) no-repeat;
			width:36px;
			height:25px;
			padding:0;
			margin:0;
			border:0;
			margin-top:2px;
		}
		.new-search-delete{
			width:50px;
			height:48px;
			border:2px solid #9EBFDB;
			border-radius:5px;
			box-shadow:1px 1px 0 #ffffff;
			display:inline-block;
			float:left;
			margin-left:5px;
			text-align: center;
			padding-top:3px;
			
		}
		.new-search-delete input{
			width:36px;
			height:25px;
			padding:0;
			margin:0;
			border:0;
		}
		.new-search-btn{
			background:url(../images/delete_new.png) no-repeat;
		}
		.new-search-download{
			background:url(../images/download.png) no-repeat;
		}
		.new-search-add{
			background:url(../images/add_new.png) no-repeat;
		}
	    </style>
<#include '/setting.ftl'>
<script type="text/javascript">
    var previewPrefix = '${previewPrefix}';
	var createuser = '${SESSION_USER.userName!}';
	var ctx = '${ctx}';
	var store = null;
var fields =  [ 'id','imagepath','imagetitle','link','showorder','state'];
var columns = "";
var condition = "";
var grid ;
var myMask;
var win;
function showMessage(title,desc){
		   Ext.Msg.alert(title,desc);
} 

var currentEdit;
var editRecord;
Ext.onReady(function(){
	   store = new Ext.data.Store( 
	     	{
		       	proxy:new Ext.data.HttpProxy({
		       	url: ctx+'/smgindexrightbottomimage/getpagedata'  
		       }),
	       reader:new Ext.data.JsonReader({
	           root:"root",  
	           totalProperty: 'count',
	           fields:fields
	         }),
	         pruneModifiedRecords:true
	     });
	     
	   var bbar= new Ext.PagingToolbar({
	        pageSize: 25,
	        store: store,
	        loadMask: this.LoadMask,
	        displayInfo: true,
	        displayMsg: '当前为第[{0}]</span>条至第[{1}]条数据，共[{2}]条数据',
	        emptyMsg: "没有数据"   
	    });
	    var cm = new Ext.grid.ColumnModel([
		   	  {header: "id", width: 20, sortable: true, dataIndex: 'id',sortable:true},      
	          {header: "图片", width: 170, sortable: true, dataIndex: 'imagepath',sortable:true,renderer:function(value,cellmeta,record){
			  	var	large = value.replace("small","");
			  		return "<a  target='_blank' title='点击查看大图' href='"+value+"'><img  src='"+value+"'></a>";
			  }},     
	          {header: "文字描述", width: 80, sortable: true, dataIndex: 'imagetitle',sortable:true},
			  {header: "图片链接", width: 100, sortable: true, dataIndex: 'link',sortable:true},
	          {header: "位置", width: 40, sortable: true, dataIndex: 'showorder',sortable:true},
			  {header: "状态", width: 40, sortable: true, dataIndex: 'state',sortable:true,renderer:function(value,cellmeta,record){   
			  		if ( value  == 1){
			  			return "<font color='green'>在线</font>";
			  		}else{
			  			return "<font color='red'>预览</font>";
			  		}
			  }},
			  {header: "操作", width: 80, sortable: true, dataIndex: 'showorder',sortable:true,renderer:function(value,cellmeta,record,rowIndex){
			  		var state = record.get("state");
			  		if ( state == 1){
			  			return "<a href='javascript:copy("+rowIndex+")' >将数据复制到预览</a>";
			  		}else{
			  			return "<a href='javascript:edit("+rowIndex+")'  >编辑</a>&nbsp&nbsp;<a href='${previewPrefix}' target='_blank'>预览</a>&nbsp;&nbsp;<a href='#' onclick='setOnline("+rowIndex+")'>设置上线</a>";
			  		}
			  }  }
	    ]);
	    
	   var clickFlag = false;
	    	//定义加载数据遮罩层
	   myMask = new Ext.LoadMask(Ext.getBody(), {msg:"加载数据中,请等待......",store:store,removeMask :true});
	   var submitFlag = false;
	    // define grid start
	     grid = new Ext.grid.EditorGridPanel({
	    	 id:'grid', 
	    	layout : 'fit',
	    	// 自动适应宽高
	        autoWidth:true,
	    	autoHeight : true,
	        width:document.body.clientWidth,  
	        height: document.body.clientHeight,  
	    	maskText : '正在加载中...',
	     	getLoadMask : function(){
	         	if(this.LoadMask){
	          		return this.LoadMask;
	         	}else{
	          		this.LoadMask = new Ext.LoadMask(Ext.getBody(),{msg:this.maskText,removeMask : true});
	          		return this.LoadMask;
	         	}
	        },
	         setMaskText : function(msg){
	        	this.maskText = msg;
	        	this.getLoadMask().msg = this.maskText;
	        },
	      	store:store, 
	      	      // 每次只能选择一行
	        sm: new Ext.grid.RowSelectionModel({singleSelect:true}),   
	   		title: "右侧2个广告位图片",
	         cm:cm,
			 bbar:bbar,
	         viewConfig:{
	          	forceFit: true
	         },tbar:[
	         ]
	    });
			store.on('beforeload',function( store , options ){
          	store.baseParams = {
          	};  
			}); 
		  store.load(  {  params:{start:0,limit:25} }  );
		  grid.render("infoDiv");
		  viewPic("demo");
	      	 
});
function copy(rowIndex){
	editRecord  = store.getAt(rowIndex);
	var showorder = editRecord.get("showorder");
	if (confirm("确认将线上的第 "+ showorder +" 个位置的数据复制到预览数据吗?")){
		Ext.lib.Ajax.request('POST', '/smgindexrightbottomimage/copy/'+showorder, {
				success: function(response){
					Ext.Msg.alert('复制成功',"复制成功");
					store.reload();
				},
				failure: function(){
					Ext.Msg.alert('复制失败,服务器内部错误');
				}
			},
			'');
		
	}
}
function setOnline(rowIndex){
	editRecord  = store.getAt(rowIndex);
	var id = editRecord.get("id");
	var showorder = editRecord.get("showorder");
	if (confirm("确认上线第"+showorder+"个位置吗?")){
		Ext.lib.Ajax.request('POST', '/smgindexrightbottomimage/setonline/'+id, {
				success: function(response){
					Ext.Msg.alert('上线成功',"上线成功");
					store.reload();
				},
				failure: function(){
					Ext.Msg.alert('上线失败,服务器内部错误');
				}
			},
			'');
		
	}
}
//var fields =  [ 'id','imagepath','imagetitle','groupName','groupLink','link','showorder','state'];
function edit(rowIndex){
	editRecord  = store.getAt(rowIndex);
	var showorder = editRecord.get("showorder");
	if(!win){
				win = new Ext.Window({
					el:'hello-win',
					title:"编辑第"+showorder+"个位置",
					layout:'fit',
					width:500,
					height:290,
					hidden:true,
					resizable:false,
					closeAction:'hide',
					plain: true,
					contentEl : "nleft",
			        buttons: [{
						        text:'保存',
						        handler:  function(){
						        	update();
			                    }
						    },
						    {
					            text: '取消', 
								handler: function(){
			                        win.hide();
			                    }
							}]
				});
			}
		$("#logoImg").attr("src",editRecord.get("imagepath"));	
		$('#imagetitle').val( editRecord.get("imagetitle"));
		$('#groupName').val( editRecord.get("groupName"));
		$('#groupLink').val( editRecord.get("groupLink"));
		$('#link').val( editRecord.get("link"));
		$('#id').val( editRecord.get("id"));
		$('#imagepath').val( editRecord.get("imagepath"));
		win.setTitle("编辑第"+showorder+"个位置"); 
		win.show();
			
}
function update(){
	if ( checkInputValueForShow("imagetitle",100,"string",false,false) &&
		 checkInputValueForShow("link",100,"string",false,false) 
	)	{
		setWinMaskShow(win);
		$.ajaxFileUpload({
			url : "${ctx}/smgindexrightbottomimage/update",
			secureuri:false,
			data:{
				maxSize:5,
				imagetitle:$('#imagetitle').val(),
				link:$('#link').val(),
				id:$('#id').val(),
				imagepath:$('#imagepath').val()
 			},
			type:"post",
			dataType:'json',
			fileElementId:"filename",
			success: function (data, status){
				if ( data.state == "1" ){
					Ext.Msg.alert('修改成功');
				}else{
					Ext.Msg.alert('修改失败',data.desc);
				}
					setWinMaskHide(win);
					win.hide();
					store.reload();
				
			},
			error: function (data, status, e){
				Ext.Msg.alert('修改失败,服务器内部错误',e);
				setWinMaskHide(win);
			}
		});
	}
	
}
</script>
</head>
<body>
	<div class="x-panel-header-new">
		<div class="new-search-wrap">
			<span class="new-select-city">
				<label for="">城市选择</label>
				<select>
					<option value="${userCityNos}">全部</option>
					<#list cityList as city>
					<option value="${city.cityno}">${city.cityname}</option>
					</#list>
				</select>
			</span>
			<span class="new-search-button"><label for="">查询</label><input type="text"  style="cursor:pointer" readonly="true" value="" onclick='query();' /></span>
		</div>
		<!--
		<span class="new-search-delete">
			<label for="" style="margin-bottom:2px">下载</label><input type="button"  style="cursor:pointer" class="new-search-download"  onclick="downloadExcel()" />
		</span>-->
	</div>
		<div id="enlarge_images" style="border:3px #CCC solid;z-index:9999;"></div>
		<input type='hidden' name='imagepath' id='imagepath'>
		<input type='hidden' name='id' id='id'>
		<div id="infoDiv" style="margin-top:10px;"></div>
		<!-- 编辑的表单-->
		<div id="hello-win" class="x-hidden">
			<div id="nleft" class="nleft" style="background: white;">
				<table width="482" border="0" cellpadding="0" cellspacing="0">
					<tbody>
						<tr bgcolor="#ECF1FA">
							<td width="150" height="30" align="center">上传图片</td>
							<!--var fields =  [ 'id','imagepath','imagetitle','groupName','groupLink','link','showorder','state']; -->
							<td   style="padding-left:3px;">
								<span id="uploadSpan" style="float:left;margin-top:15px;">
									<input type="file" ContentEditable="false" name="filename" id="filename">
								</span>
								<div id="demo" style="overflow:hidden;text-align:center;float:left;">
								<a href=''>
									<img id="logoImg" width="100" height="30"/>
								</a>
								</div>
							</td>
						</tr>
						<tr>
							<td width="150" height="30" align="center"><span>图片链接</span></td>
							<td align="center"><input type="text"style='width:250px;'  id="link" name="link"/></td>
						</tr>
						<tr  bgcolor="#ECF1FA">
							<td width="150" height="30" align="center"><span>文字描述</span></td>
							<td align="center"><input type="text" style='width:250px;' id="imagetitle" name="imagetitle"/></td>
						</tr>
				    </tbody>
				  </table>
			</div>
		</div>	  		
</body>
</html>